﻿<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0' />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>联系我们单页</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="stylesheet" type="text/css" href="./font/iconfont.css">
    <link rel="stylesheet" type="text/css" href="./css/color.css">
    <link rel="stylesheet" type="text/css" href="./css/global.css">
    <link rel="stylesheet" type="text/css" href="./css/page.css">
    <link rel="stylesheet" type="text/css" href="./css/uzlist.css">
    <link rel="stylesheet" type="text/css" href="./lib/animate/animate.min.css">
    <link rel="stylesheet" type="text/css" href="./lib/fancybox/fancybox.css" />
</head>

<body>
    <div class="header" style="background:#ffffff;">
        <div class="container">
            <div class="logo fl">
                <div class="logo-img"><a href="./index.html"><img src="./images/0accc80f85507ec130679ba35018b042.jpg" /></a></div>
            </div>
            <div class="nav nav-a fr">
                <ul>
                    <li data-cid="0">
                        <a style="color:#333" target="_self" href="./index.html">首页</a>
                    </li>
                    <li data-cid="9">
                        <a style="color:#333" target="_self" href="./about.html">关于我们</a>
                    </li>
                    <li data-cid="10">
                        <a style="color:#333" target="_self" href="./case.html">成功案例</a>
                        <div id="case-childer" class="childer"></div>
                    </li>
                    <li data-cid="15">
                        <a style="color:#333" target="_self" href="./partner.html">合作伙伴</a>
                    </li>
                    <li data-cid="12">
                        <a style="color:#333" target="_self" href="./news.html">视讯中心</a>
                    </li>
                    <li data-cid="18" class="on">
                        <a style="color:#333" target="_self" href="./contact.html">联系我们</a>
                        <div class="childer">
                            <a target="_self" class="childer-a" href="./contact.html">联系方式</a>
                            <a target="_self" class="childer-a" href="./contact.html">地理位置</a>
                            <a target="_self" class="childer-a" href="./contact.html">在线留言</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="back-color">
        <div class="container box-content">
            <div class="con-left">
                <div class="subcat">
                    <div class="sub-tit">
                        <h3>联系我们</h3>
                        <span class="ar">Contact Us</span>
                    </div>
                    <ul>
                        <li class="cursor" data-i="1" data-anchor="contact-19"><i></i><a href="javascript:;">联系方式</a></li>
                        <li class="cursor" data-anchor="contact-20"><i></i><a href="javascript:;">地理位置</a></li>
                        <li class="cursor" data-anchor="contact-21"><i></i><a href="javascript:;">在线留言</a></li>
                    </ul>
                </div>
                <div class="subtac">
                    <p>咨询热线：</p>
                    <strong id="tel" class="ar"></strong>
                </div>
            </div>
            <div class="con-right">
                <div class="current">
                    <div class="curr-left fl">
                        <h3>联系我们</h3>
                    </div>
                    <div class="curr-right">
                        <div class="curr-a">
                            <span class="txt">您当前的位置：</span>
                            <a class="home" href="/">首页</a>
                            <i class="icon5s s5you1"></i><a href="./contact.html">联系我们</a>
                        </div>
                    </div>
                </div>
                <div class="page-about">
                    <div class="detail after">
                        <div class="contactus-order">
                            <a class="contact-19"></a>
                            <div class="contact-us after">
                                <div id="contact" class="us-left fl"><!--左侧图片--></div>
                                <div class="us-right fr">
                                    <h5>联系方式</h5>
                                    <p id="company-desc" class="desc"></p>
                                    <ul>
                                        <li>
                                            <span>联系电话</span>
                                            <p id="company-tel"></p>
                                        </li>
                                        <li>
                                            <span>联系邮箱</span>
                                            <p id="company-email"></p>
                                        </li>
                                        <li>
                                            <span>公司地址</span>
                                            <p id="company-address"></p>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="contactus-order">
                            <a class="contact-20"></a>
                            <h5 class="head-tit">地理位置</h5>
                            <div class="sector_content">
                                <div id="maps" style="overflow: hidden;"></div>
                            </div>
                        </div>
                        <div class="contactus-order">
                            <a class="contact-21"></a>
                            <h5 class="head-tit">在线留言</h5>
                            <div class="feedback">
                                <div class="feedback-list">
                                    <ul>
                                        <li>
                                            <label>你的名字</label>
                                            <input type="text" name="username" placeholder="请输入名字" datatype="*2-15" nullmsg="名字不能为空" errormsg="名字格式为2-15个字符">
                                        </li>
                                        <li>
                                            <label>电话</label>
                                            <input type="text" name="tel" placeholder="请输入电话" datatype="*8-15" nullmsg="电话不能为空" errormsg="电话格式为8-15个字符">
                                        </li>
                                        <li>
                                            <label>邮箱</label>
                                            <input type="text" name="email" placeholder="请输入邮箱" ignore="ignore" datatype="e" nullmsg="邮箱不能为空" errormsg="邮箱格式错误">
                                        </li>
                                        <li class="textarea">
                                            <textarea name="content" placeholder="请输入留言内容" datatype="*5-255" nullmsg="内容不能为空" errormsg="内容格式为5-255个字符"></textarea>
                                        </li>
                                        <li class="submit">
                                            <span class="error-hide" style="top:0px;left:12px; color:#ff0000; line-height: 42px;vertical-align: middle;"></span>
                                            <input type="hidden" name="title" value="表单信息" />
                                            <input type="submit" class="input-submit" value="提交留言" onclick="$.mainu.submitMessageBoard()" />
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="footer footer-a back-black" style='background:#333;'>
        <div class="container">
            <div class="footer-text left">
                <div class="footer-nav">
                    <a target="_self" href="./index.html">首页</a>
                    <a target="_self" href="./about.html">关于我们</a>
                    <a target="_self" href="./case.html">成功案例</a>
                    <a target="_self" href="./partner.html">合作伙伴</a>
                    <a target="_self" href="./news.html">视讯中心</a>
                    <a target="_self" href="./contact.html">联系我们</a>
                </div>
                <div class="copyright"></div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="./lib/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/jquery/jquery.superslide.2.1.1.min.js"></script>
    <script type="text/javascript" src="./lib/wow/wow.min.js"></script>
    <script type="text/javascript" src="./lib/fancybox/fancybox.js"></script>
    <script type="text/javascript" src="./js/common.min.js"></script>
    <script type="text/javascript" src="js/services.js"></script>
    <script type="text/javascript" src="js/logs.js"></script>
    <script type="text/javascript">
        (function ($) {
            $.mainu = {
                init: function () {
                    $.mainu.inits();
                    $.mainu.getSysConfig();
                    $.mainu.getInstitutionCompany();
                    $.mainu.getInfoClass();
                    $.mainu.getInfoPageByContact();
                    $.mainu.getInfoPageByMap();
                },
                inits: function () {
                    $(".subcat ul li").on("click", function () {
                        var offsettop;
                        var anchor = $(this).attr("data-anchor"),
                            datai = $(this).attr("data-i");
                        (datai == 1) ? offsettop = $("." + anchor).offset().top - 90 : offsettop = $("." + anchor).offset().top;
                        $("body,html").animate({
                            scrollTop: offsettop
                        }, 700);
                    });
                },
                getSysConfig: function () {
                    var url = createSysConfigUrl();
                    $.get(url, function (res) {
                        var code = res.code;
                        var msg = res.message;
                        if (code == 0) {
                            var title = res.data.title;
                            var keywords = res.data.keywords;
                            var description = res.data.description;
                            var copyright = res.data.copyright;
                            $("title").text(title);
                            $("meta[name='keywords']").attr({ content: keywords });
                            $("meta[name='description']").attr({ content: description });
                            $(".copyright").text(copyright);
                        }
                    });
                },
                getInstitutionCompany: function () {
                    var url = createInstitutionCompanyUrl();
                    $.get(url, function (res) {
                        var code = res.code;
                        var msg = res.message;
                        if (code == 0) {
                            $("#tel").text(res.data.tel);
                            $("#company-desc").text(res.data.description);
                            $("#company-tel").text(res.data.tel);
                            $("#company-email").text(res.data.email);
                            $("#company-address").text(res.data.address);
                        }
                    });
                },
                getInfoClass: function () {
                    var id = "4364079078";
                    var path = "list/parent";
                    var url = createInfoClassUrl(path);
                    var queryString = { parentid: 4364079078 };
                    $.get(url, queryString, function (res) {
                        var code = res.code;
                        var msg = res.message;
                        if (code == 0) {
                            var total = res.data.total;
                            var lists = res.data.rows;
                            var columnBody = "";
                            for (var i = 0; i < lists.length; i++) {
                                columnBody += `<a target="_self" class="childer-a" href="./case.html?classid=${lists[i].id}">${lists[i].name}</a>`;
                            }
                            $("#case-childer").html(columnBody);
                        }
                    });
                },
                getInfoPageByContact: function () {
                    var id = "4310920852";
                    var url = createInfoPageUrl(id);
                    $.get(url, function (res) {
                        var code = res.code;
                        var msg = res.message;
                        if (code == 0) {
                            var title = res.data.title;
                            var content = res.data.content;
                            $("#contact").html(content)
                        }
                    });
                },
                getInfoPageByMap: function () {
                    var id = "4352538814";
                    var url = createInfoPageUrl(id);
                    $.get(url, function (res) {
                        var code = res.code;
                        var msg = res.message;
                        if (code == 0) {
                            var title = res.data.title;
                            var content = res.data.content;
                            $("#maps").html(content)
                        }
                    });
                },
                submitMessageBoard: function () {
                    var url = createServiceMessageBoardUrl("save");
                    var name = $("input[name='username']").val();
                    var tel = $("input[name='tel']").val();
                    var email = $("input[name='email']").val();
                    var address = $("input[name='address']").val();
                    var content = $("textarea[name='content']").val();
                    if (name.length == 0) {
                        $(".error-hide").text("姓名不能为空！");
                        return;
                    }
                    if (tel.length == 0) {
                        $(".error-hide").text("电话不能为空！");
                        return;
                    }
                    if (email.length == 0) {
                        $(".error-hide").text("邮箱不能为空！");
                        return;
                    }
                    if (content.length == 0) {
                        $(".error-hide").text("内容不能为空！");
                        return;
                    }
                    var data = {
                        member_id: uuid,
                        nick_name: name,
                        name: name,
                        company_name: "",
                        phone: tel,
                        email: email,
                        address: address,
                        image_src: "",
                        content: content
                    };
                    $.ajax({
                        url: url,
                        type: "POST",
                        cache: false,
                        data: JSON.stringify(data),
                        contentType: "application/json",
                        dataType: "json",
                        error: function (XMLHttpRequest, textStatus, errorThrown) {

                        },
                        success: function (res) {
                            console.log(res);
                            var code = res.code;
                            var msg = res.message;
                            if (code == 0) {
                                $(".error-hide").text(msg);
                            } else {
                                $(".error-hide").text(msg);
                            }
                        }
                    });
                }
            };
            $(function () {
                $.mainu.init();
            });
        })(jQuery);
    </script>
</body>

</html>